<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height">
    <title></title>
    <link href="css/ionic.min.css" type="text/css" rel="stylesheet"/>
    <script type="text/javascript" charset="UTF-8" src="js/ionic.bundle.min.js"></script>
    <script charset="UTF-8" type="text/javascript" src="js/ionic.min.js"></script>
</head>
<body>
<div class="bar bar-header bar-calm">
    <h1 class="title">1111</h1>
    <a class="button button-clear icon  ion-ios-gear"></a>
</div>
<div class="bar bar-subheader bar-stable">
    <div class="button-bar">
        <a class="button button-balanced">要闻</a>
        <a class="button button-clear">财经</a>
        <a class="button button-clear">娱乐</a>
        <a class="button button-clear">体育</a>
        <a class="button button-clear">科技</a>
    </div>
</div>
<div class="scroll-content has-header has-subheader">
    <a class="button button-block button-energized" href="index2.html">上一个案例-上中下布局</a>
   <a class="button button-block button-energized" href="index4.html">下一个案例-搜索框</a>
</div>
<div class="bar bar-footer bar-dark">
    <div class="button-bar">
        <a class="button button-clear icon ion-document-text">纠结</a>
        <a class="button button-clear icon ion-document-text">纠结</a>
        <a class="button button-clear icon ion-document-text">纠结</a>
        <a class="button button-clear icon ion-document-text">纠结</a>
    </div>
</div>
</body>
</html>